<template>
  <el-form label-width="90px" size="mini">
    <el-form-item label="数据配置">
      <el-button type="info" @click="onAdd">配置Option</el-button>
    </el-form-item>

    <!-- 数据集选择 -->
    <simple-dialog2 v-bind.sync="dialog" theme="dark" @on-ok="onDialogOk"/>
  </el-form>
</template>

<script>

import dialogMixin from "@/components/common/dialog/dialog-mixin"
import optionScript from "@/package/components/option-script";

export default {
  name: 'bar01-option',
  cnName: 'bar01-option',
  mixins: [dialogMixin],
  components: {
  },
  props: {
    attribute: Object
  },
  data() {
    return {
      shapeList: [
        {label: '多边形', value: 'polygon'},
        {label: '圆形', value: 'circle'}
      ]
    }
  },
  methods: {
    onAdd(evt) {
      const origin = {
        x: evt.pageX,
        y: evt.pageY
      }
      this.setDialog({
        title: '数据图表配置',
        origin: origin,
        comp: optionScript,
        width: '90%',
        props: {
          value: this.attribute.optionFn,
          type: 'option'
        }
      })
    },
    onDialogOk(res) {
      console.info('res:', res)
      this.dialog.visible = false
      this.attribute.optionFn = res
    }
  }
}
</script>

<style lang="less" scoped>
.table-wrap {
  padding: 0 10px;
}
</style>
